<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>
        Login
    </title>

    <meta name="description" content="">


    <link rel="stylesheet" href="css/app.css">

</head>

<body class=" font-sans bg-white antialiased">

    <section class="flex min-h-screen px-4 pt-6 bg-gray-100 sm:pt-10">

        <div class="flex-1 max-w-lg mx-auto">
            <div class="flex justify-center">
                <a href="index.html" aria-label="LaunchList Logo">
                   LOGO




                </a>
            </div>

            <div class="p-6 mt-4 bg-white border border-gray-300 rounded-xl">





                <form method="POST" action="login.html">
                    <input type="hidden" name="_token" value="">
                    <h1 class="text-lg font-semibold text-gray-900">
                        Login
                    </h1>
                    <div class=" mt-4 ">
                        <label class="block">
                            <span class="dark:text-gray-400 text-sm font-medium text-gray-600">Email</span>
                            <input
                                class="block w-full dark:bg-gray-800 dark:text-gray-100 transition duration-300 text-gray-700 rounded-md placeholder-gray-400 dark:placeholder-gray-500 focus:dark:placeholder-gray-400 focus:placeholder-gray-300 border focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 mt-1 border-gray-300 dark:border-gray-700"
                                autocomplete="email" required="required" placeholder="email" value="" name="email"
                                type="text" />
                        </label>

                    </div>
                    <div class="mt-4 ">
                        <label class="block">
                            <span class="text-sm font-medium text-gray-600 dark:text-gray-400">Password</span>
                            <div class="relative" x-data="{ show: true }">
                                <input
                                    class="  block w-full dark:bg-gray-800 dark:text-gray-100 transition duration-300 text-gray-700 rounded-md placeholder-gray-400 dark:placeholder-gray-500 focus:dark:placeholder-gray-400 focus:placeholder-gray-300 border focus:border-primary-300 focus:ring focus:ring-primary-200 focus:ring-opacity-50 mt-1 border-gray-300 dark:border-gray-700"
                                    required="required" placeholder="Enter your password" name="password"
                                    autocomplete="current-password" :type="show ? 'password' : 'text'">
                                <div class="absolute inset-y-0 right-0 flex items-center pr-3 text-sm leading-5">
                                    <span @click="show = !show" :class="{'hidden': !show, 'block':show }">
                                        <svg class="h-4 text-gray-500" xmlns="http://www.w3.org/2000/svg" fill="none"
                                            viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"
                                            aria-hidden="true">
                                            <path stroke-linecap="round" stroke-linejoin="round"
                                                d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />
                                            <path stroke-linecap="round" stroke-linejoin="round"
                                                d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z" />
                                        </svg> </span>
                                    <span @click="show = !show" :class="{'block': !show, 'hidden':show }">
                                        <svg class="h-4 text-gray-500" xmlns="http://www.w3.org/2000/svg" fill="none"
                                            viewBox="0 0 24 24" stroke-width="2" stroke="currentColor"
                                            aria-hidden="true">
                                            <path stroke-linecap="round" stroke-linejoin="round"
                                                d="M13.875 18.825A10.05 10.05 0 0112 19c-4.478 0-8.268-2.943-9.543-7a9.97 9.97 0 011.563-3.029m5.858.908a3 3 0 114.243 4.243M9.878 9.878l4.242 4.242M9.88 9.88l-3.29-3.29m7.532 7.532l3.29 3.29M3 3l3.59 3.59m0 0A9.953 9.953 0 0112 5c4.478 0 8.268 2.943 9.543 7a10.025 10.025 0 01-4.132 5.411m0 0L21 21" />
                                        </svg> </span>
                                </div>
                            </div>
                        </label>
                    </div>

                    <div class="flex flex-col mt-3">
                        <label class="flex items-center">
                            <input type="checkbox" value="1"
                                class="border border-gray-300 rounded focus:ring-primary-500 focus:border-primary-500 text-primary-500 dark:bg-gray-500 dark:border-gray-400"
                                name="remember" />

                            <span class="ml-2 text-sm text-gray-700 dark:text-gray-400">Remember Me</span>
                        </label>

                    </div>

                    <div class="flex items-center justify-between">
                        <button
                            class="bg-primary-500 w-full flex justify-center items-center hover:opacity-90 text-white font-medium py-2 px-4 focus:outline-none rounded-lg focus:shadow-outline mt-6"
                            type="submit" id="button-load">
                            <span class=" button-load-text"><span class="text-white">Log in</span></span>
                            <span class="hidden py-1.5 ml-2 button-load-spin"><svg class="w-4 h-4 animate-spin"
                                    xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" width="1em"
                                    height="1em" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24">
                                    <path fill="none" stroke="currentColor" stroke-linecap="round"
                                        stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 1 1-6.219-8.56" />
                                </svg></span>
                        </button>
                    </div>



                    <p class="mt-4 text-sm font-normal leading-snug text-left text-gray-500">
                        Forgot your password?
                        <a class="text-gray-700 border-b border-transparent hover:border-b hover:border-gray-900"
                            href="forgot-password.html">
                            Reset here
                        </a>
                    </p>

                    <p class="mt-4 text-sm font-normal leading-snug text-left text-gray-500">
                        New to PromptVine?
                        <a class="text-gray-700 border-b border-transparent hover:border-b hover:border-gray-900"
                            href="register.html">
                            Create an account
                        </a>
                    </p>

                </form>
            </div>
        </div>

    </section>



    <!-- Livewire Component wire-end:54VwUutWVemFgMEHr25F -->
    <script src="js/app.js"></script>

</body>

</html>